<template>
    <div class="scroll-content">

      <a-typography>
        <a-typography-title class="headline">
          <span class="accent">演示</span> 参数检测
        </a-typography-title>
  
        <a-typography-paragraph>
               
        </a-typography-paragraph> 
  
     <a-typography-title :level="4">1、电脑机器码</a-typography-title>
      <a-typography-paragraph>
        机器码常用于软件安装和注册场景，Electron主控端读取机器码，依赖node-machine-id 组件，由于字符串太长，所以做了一次MD5。
       </a-typography-paragraph>  

        <a-typography-paragraph>
        <a-space :size="5">
          <a-button type="default" @click="readMachineId" shape="round">MachineID</a-button> 
           <b>MachineID</b>：{{ machineId }} 
           
        </a-space>
               
        <a-typography-title :level="4">2、HttpServer服务状态</a-typography-title>
        <a-typography-paragraph>
        如果你的软件用于局域网用户提供Web服务，一般会需要开启Http服务，当然如果通过穿透工具也可以对外网提供Web访问，修改配置文件位于electron/config/config.default.js。
       </a-typography-paragraph>  
       <a-space :size="5">
          <a-button type="default" @click="checkHttpServer" shape="round">HttpServer</a-button>  
          <b>HttpServe</b>：{{ serveState }}
        </a-space>
      
      </a-typography-paragraph>       
              
  
      </a-typography>
    </div>
  </template>
  
  <script setup>
  import { ipcApiRoute } from "@/api/main";
  import { ipc, isEE } from "@/utils/ipcRenderer";
  import { message } from "ant-design-vue";
  
  import storage from "store2";
  import { onMounted, ref } from "vue";
  
  const machineId = ref("-");
  const serveState = ref("-");
 
 
  message.config({
    top: "120px",
    duration: 1,
    maxCount: 4,
  });
  
  onMounted(() => {
    init();
  });
  
  const init = () => {
    // readMachineId();
  };
  const checkHttpServer = () => {
  if (isEE) {
    serveState.value = "-";
    ipc.invoke(ipcApiRoute.demo.checkHttpServer, {}).then((r) => {
      if (r.enable) {
        setTimeout(() => {
          serveState.value = r.server;
          storage.set("config", r);
        }, 200);
      } else {
        serveState.value = "未开启";
      }
    });
  } else {
    serveState.value = "浏览器中不能读取";
    message.error("部分功能需要EE环境支持");
  }
};
  const readMachineId = () => {
    if (isEE) {
      machineId.value = "-";
      ipc.invoke(ipcApiRoute.demo.getMachineId).then((res) => {
        machineId.value = res;
        storage.set("config", { machineid: res });
      });
    } else {
      serveState.value = machineId.value = "浏览器中不能读取";
      message.error("部分功能需要EE环境支持");
    }
  };
  
  

  const readConfig = () => {
    const params = {
      action: "getDataDir",
    };
    if (isEE) {
      ipc.invoke(ipcApiRoute.demo.jsondbOperation, params).then((res) => {
        console.log("res:", res);
        records.value = res.all_list;
      });
    } else {
      message.error("开发模式无法操作数据库");
    }
  };
  
  const readSystem = () => {
    const params = {
      action: "readSetting",
      info: { key: "machineCode" },
    };
    if (isEE) {
      ipc.invoke(ipcApiRoute.demo.jsondbOperation, params).then((res) => {
        console.log("res:", res);
        records.value = res.all_list;
      });
    } else {
    }
  };

  </script>
  
  <style lang="less" scoped>
  .scroll-content {
    height: 100%;
    margin-right: 5px;
    font-weight: 400;
    padding: 10px 30px 30px 20px;
    box-sizing: border-box;
    overflow: auto;
  }
  
  @media (min-width: 960px) and (max-width: 1299px) {
    .scroll-content {
      padding: 20px 40px 30px 30px;
    }
  }
  
  @media (min-width: 1300px) {
    .scroll-content {
      padding: 30px 50px 30px 50px;
    }
  }
  
  .scroll-content::-webkit-scrollbar-track {
    background-color: #f1f1f1;
    border-radius: 10px;
  }
  
  .scroll-content::-webkit-scrollbar-thumb {
    background-color: #888;
    border-radius: 10px;
    border: 2px solid #ffffff;
  }
  
  .scroll-content::-webkit-scrollbar {
    width: 10px;
  }
  
  html:not(.dark) .accent,
  .dark .headline {
    background: -webkit-linear-gradient(315deg, #42d392 25%, #647eff);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  
  .sysinfo {
    max-width: 600px;
    width: 50%;
    color: #00770b;
    line-height: 1.4;
    float: right;
    padding: 10px;
    word-wrap: break-word;
  }
  
  p {
    line-height: 1.8;
    margin-top: 10px;
  }
  
  .headline {
    font-size: 32px;
    line-height: 1.9;
    font-weight: bold;
    letter-spacing: -1.5px;
    margin: 0px auto;
  }
  
  .subtitle {
    line-height: 1.5;
    color: var(--vt-c-text-2);
    transition: color 0.5s;
    font-size: 22px;
    margin: 44px auto 16px;
  }
  
  .actions a,
  .actions .btn {
    font-size: 16px;
    line-height: 1;
    display: inline-block;
    background-color: var(--vt-c-bg-mute);
    padding: 6px 16px;
  
    font-weight: 500;
    border-radius: 30px;
    transition:
      background-color 0.5s,
      color 0.5s;
    text-decoration: none;
  }
  
  .actions .btn {
    margin: 0px 8px 8px 0px;
    text-align: center;
    color: var(--vt-c-text-code);
    border: 0px;
    cursor: pointer;
    background: -webkit-linear-gradient(315deg, #42d392 25%, #647eff);
  }
  
  .actions .btn:hover {
    background-color: var(--vt-c-gray-light-4);
    transition-duration: 0.2s;
  }
  </style>
  